<template>

    <div>
        <div>
            <!-- 添加跟进  选择客源 --> 
            <div v-if="this.typedata == 1">
                <div>
                    <el-form :model="customerform" inline size="mini">
                        <el-form-item label="部门" prop="c_store_id">
                            <el-select v-model="customerform.c_store_id" placeholder="请选择" @change="obtainusers">
                                <!-- <el-option v-for="(item,index) in optionName" :key="index" :label="item.name" :value="item.id"></el-option> -->
                                <el-option label="全部" value=""></el-option>
                                <el-option-group v-for="group in optionName" :key="group.label" :label="group.label">
                                    <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-option-group>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="" prop="c_employees_id">
                            <el-select v-model="customerform.c_employees_id" placeholder="请选择">
                                <el-option v-for="(item,index) in usertypess" :key="index" :label="item.u_username" :value="item.u_id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="城区" prop="c_secondary_area">
                            <el-select v-model="customerform.c_secondary_area" placeholder="请选择">
                                <el-option v-for="(item,index) in customeroptlist.area_list" :key="index" :label="item.name" :value="item.code"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="交易" prop="c_trading_type">
                            <el-select v-model="customerform.c_trading_type" placeholder="请选择">
                                <el-option v-for="(item,index) in customeroptlist.transaction" :key="index" :label="item.st_name" :value="item.st_id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="状态" prop="c_buy_status">
                            <el-select v-model="customerform.c_buy_status" placeholder="请选择">
                                <el-option v-for="(item,index) in customeroptlist.status" :key="index" :label="item.st_name" :value="item.st_id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="" prop="keywords">
                            <el-input v-model="customerform.keywords" class="normal_inp" placeholder="编号、名字、手机号"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="searchbtn('customerform')" size="mini">查 询</el-button>
                        </el-form-item>
                    </el-form>
                </div>
                <el-table :data="customerData">
                    <el-table-column property="c_numbering" label="编号"></el-table-column>
                    <el-table-column property="c_user_name" label="客户"></el-table-column>
                    <el-table-column property="c_trading_type_name" label="交易"></el-table-column>
                    <el-table-column property="c_secondary_area" label="城区"></el-table-column>
                    <el-table-column property="c_area_address" label="位置"></el-table-column>
                    <el-table-column property="c_buy_status" label="状态"></el-table-column>
                    <el-table-column property="c_entrust_time" label="委托日"></el-table-column>
                    <el-table-column align="center" fixed="right" label="操作" width="90">
                        <template slot-scope="scope">
                            <el-button type="text" size="small" @click="changecustomerbtn(scope.row)">选择</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <!-- 添加跟进  选择房源 -->
            <div v-if="this.typedata == 2">
                <div>
                    <el-form :model="housingform" inline size="mini">
                        <el-form-item label="部门" prop="r_d_id">
                            <el-select v-model="housingform.r_d_id" placeholder="请选择" @change="obtainusers">
                                
                                <!-- <el-option v-for="(item,index) in optionName" :key="index" :label="item.name" :value="item.id"></el-option> -->
                                <el-option label="全部" value=""></el-option>
                                <el-option-group v-for="group in optionName" :key="group.label" :label="group.label">
                                    <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value">
                                    </el-option>
                                </el-option-group>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="" prop="source_uid">
                            <el-select v-model="housingform.source_uid" placeholder="请选择">
                                <el-option label="全部" value=""></el-option>
                                <el-option v-for="(item,index) in usertypess" :key="index" :label="item.u_username" :value="item.u_id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="城区" prop="a_id">
                            <el-select v-model="housingform.a_id" placeholder="请选择">
                                <el-option label="全部" value=""></el-option>
                                <el-option v-for="(item,index) in options.area_list" :key="index" :label="item.name" :value="item.code"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="交易" prop="trading_type">
                            <el-select v-model="housingform.trading_type" placeholder="请选择">
                                <el-option label="全部" value=""></el-option>
                                <el-option v-for="(item,index) in trading_type_opt" :key="index" :label="item.name" :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="状态" prop="status">
                            <el-select v-model="housingform.status" placeholder="请选择">
                                <el-option label="全部" value=""></el-option>
                                <el-option v-for="(item,index) in options.status" :key="index" :label="item.st_name" :value="item.st_id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="" prop="keywords">
                            <el-input v-model="housingform.keywords" class="normal_inp" placeholder="房源编号、业主、业主手机号、房号"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="searchbtn('housingform')" size="mini">查 询</el-button>
                        </el-form-item>
                    </el-form>
                </div>
                <el-table :data="housingData">
                    <el-table-column align="center" prop="property_number" label="房源编号" width="120"></el-table-column>
                    <el-table-column align="center" prop="trading_name" label="交易" width="120"></el-table-column>
                    <el-table-column align="center" prop="a_id_name" label="区/县" width="120"></el-table-column>
                    <el-table-column align="center" prop="building_name" label="楼盘字典" width="120"></el-table-column>
                    <el-table-column align="center" prop="few_building" label="栋座位置" width="120"></el-table-column>
                    <el-table-column align="center" prop="r_acreage" label="面积" width="120"></el-table-column>
                    <el-table-column align="center" prop="housing_name" label="房屋类型" width="120"></el-table-column>
                    <el-table-column align="center" prop="trading_state_name" label="状态" width="120"></el-table-column>
                    <el-table-column align="center" prop="r_entrust_at" label="委托日" width="120"></el-table-column>
                    <el-table-column align="center" fixed="right" label="操作" width="90">
                        <template slot-scope="scope">
                            <el-button type="text" size="small" @click="changecustomerbtn(scope.row)">选择</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            
        </div>
    </div>
</template>

<script>
    import conf from '../../../../config/userconf.js'
    export default {
        name: "Chooselist",
        props: {
            typedata: {   //类型   1为房源   2为客源
                type: Number,
                required: true,
            }        
        },
        data () {
            var validatePhone = (rule,value,callback) => {    //正则手机号

                var MobileRegex = /^1[3|4|5|7|8][0-9]{9}$/;
                if (!MobileRegex.test(value)) {
                    callback(new Error('手机号格式不正确！'))
                } else {
                    callback();
                }
            };
            var isCardNo = (rule,value,callback) => {    //正则身份证
                                    
                var MobileRegex = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
                // var MobileRegex = /(^\d{14}[[0-9],0-9xX]$)|(^\d{17}[[0-9],0-9xX]$)/;
                if (!MobileRegex.test(value)) {
                    callback(new Error('身份证格式不正确！'))
                } else {
                    callback();
                }
            };
            return {
                customerData: [],   // 客源列表
                customerform: {
                    c_secondary_area: '',
                    c_trading_type: '',
                    c_buy_status: '',
                    c_store_id: '',
                    c_employees_id: '',
                    keywords: '',
                },
                housingData: [],   // 房源列表
                housingform: {
                    r_d_id: '',
                    source_uid: '',
                    a_id: '',
                    trading_type: '',
                    status: '',
                    keywords: '',
                },
                optionName: [], //部门
                usertypess: [], //员工
                options: '',  //房源下拉数据
                customeroptlist: '',  //客源下拉数据
                r_id: '',  //房源
                c_id: '',  //客源
                trading_type_opt: [  //交易类型下拉数据
                    {name: '求购',id: '1'},
                    {name: '求租',id: '2'},
                ],
                choose_customer_info: '',   //房源跟进 跟进方式为看房时   选择客源  展示数据
                choose_room_info: '',   //客源跟进 跟进方式为看房时   选择房源  展示数据
            }
        },
        methods: {
            pagetype(sdata=Object()){
            
                if(this.typedata == 1){   //房源
                    
                }else if(this.typedata == 2){  //客源
                    
                }
                
            },
            //查询房客源
            searchbtn(formName){
                if(this.typedata == 1){
                    let data = this.customerform;
                    this.customerlist(data);
                }else if(this.typedata == 2){
                    let data = this.housingform;
                    this.roomlist(data);
                }
                
            },
            //获取房源下拉
            optlist(data=Object()){
                conf.room.optlist(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        // console.log(res);
                        this.options = res.data.data;
                        // if(this.tjstatus == 1){
                        //     this.form.r_d_id = res.data.data.store_id;
                        //     this.form.source_uid = res.data.data.uid;
                        //     this.form.r_entrust_at = res.data.data.day;
                        // }
                        

                    }else if (state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            },
            //房源列表
            roomlist(data=Object()){
                // console.log(data);
                conf.room.list(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        // console.log(res);
                        this.housingData = res.data.data.data;
                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == -404){
                            this.housingData = [];
                        }else if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            },
            //获取客源下拉
            custoptlist(data=Object()){
                conf.resources.optlist(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        // console.log(res);
                        this.customeroptlist = res.data.data;
                    }else if (state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            },
            //客源列表
            customerlist(data=Object()){
                // console.log(data);
                conf.resources.list(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        // console.log(res);
                        this.customerData = res.data.data.data;
                        // console.log(this.customerData);
                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == -404){
                            this.customerData = [];
                        }else if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            },
            //确认选择  房客源
            changecustomerbtn(row){
                console.log(row);
                if(this.typedata == 1){
                    this.c_id = row.c_id;
                    // this.c_numbering = row.c_numbering;
                    // this.c_user_name = row.c_user_name;
                    this.choose_customer_info = row.c_numbering  +  row.c_user_name;  //选择的客源展示内容
                    //传数据至父组件
                    this.$emit('choose_info_strs',this.choose_customer_info,this.c_id);
                    // this.choosekydialogTableVisible = false;
                }else if(this.typedata == 2){  
                    this.r_id = row.id;  //选择的房源id
                    this.choose_room_info = row.property_number  +  row.building_name  +  row.few_building  +  row.position + row.r_acreage +'㎡';  //选择的房源展示内容
                    //传数据至父组件
                    this.$emit('choose_info_strs',this.choose_room_info,this.r_id);
                    // this.choosekydialogTableVisible = false;
                }
                
            },
            //获取部门
            obtainName(data=Object()){
                conf.department.nameOpt(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        this.optionName = res.data.data;
                        // console.log(res); 
                    }else if(state == 'success'&&res.data.code != 0){
                        
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else if(res.data.code == -404){
                            this.optionName = [];
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            },
            //获取部门员工(房源跟进  客源列表 查询)
            obtainusers(val,data=Object()){
                this.usertypess = [];
                this.customerform.c_employees_id = '';
                data.d_id = val;
                conf.department.userOpt(data,(state,res)=>{
                    if (state == 'success'&&res.data.code == 0){
                        // console.log(res); 
                        this.usertypess = res.data.data;
                    }else if(state == 'success'&&res.data.code != 0){
                        if(res.data.code == 401){
                            this.$router.push({name:'login'});   //登陆态失效，跳转至登录页
                        }else{
                            this.$message({
                                type: 'info',
                                message: res.data.msg
                            });
                        }
                    }
                })
            },
            
        },
        mounted (){
            this.$nextTick(function(){
                this.pagetype();  //页面状态  （修改、添加）
                this.optlist();  //房源下拉数据
                this.custoptlist(); //客源下拉数据
                this.obtainName();  //部门下拉
            })
        },

    }
</script>